import zrender from 'zrender'

export const floorLocations = {
  floor0: {
    camera: [
      { x: 179, y: 200, status: 1, equipmentLocalId: '1', equipmentName: '摄像头' },
      { x: 230, y: 245, status: 1, equipmentLocalId: '2', equipmentName: '摄像头' }
    ]
  },
  floor1: {
    camera: [
      { x: 45, y: 54, status: 1, equipmentLocalId: '1', equipmentName: '摄像头' },
      { x: 65, y: 66, status: 1, equipmentLocalId: '2', equipmentName: '摄像头' }
    ]
  }
}

// 插入图像
export const createBackground = (url, width, height) => {
  let backImg = new zrender.Image({
    zlevel: 0,
    style: {
      image: url,
      x: 0,
      y: 0,
      width: width,
      height: height
    }
  })
  return backImg
}

// 点位转换
export const dotTransfer = (x, y, lastWidth, lastHeight, nowWidth, nowHeight) => {
  const widthScale = (nowWidth / lastWidth).toFixed(2)
  const heightScale = (nowHeight / lastHeight).toFixed(2)
  let newX = (widthScale * x).toFixed(1)
  let newY = (heightScale * y).toFixed(1)
  return { newX, newY }
}

// 插入图标
export const createImg = (cate, url) => {
  let Group = new zrender.Group()
  cate.forEach(obj => {
    let x = obj.x
    let y = obj.y
    // 定义图标
    let objIcon = new zrender.Image({
      zlevel: 2,
      scale: [1, 1],
      style: {
        image: url,
        x: x,
        y: y,
        width: 26,
        height: 26,
        opacity: 1
      }
      // onclick () {
      //   if (cateTxtEn === 'camera_a') {
      //     store.commit('floor/setVideoUrl', obj.url)
      //     store.commit('floor/setVideoVisible', true)
      //   } else {
      //     store.commit('floor/setDeviceInfo', { name: obj.equipmentName, number: obj.equipmentLocalId, status: obj.status, type: obj.type, already: obj.already, overflowNum: obj.overflowNum })
      //     store.commit('floor/setDeviceVisible', true)
      //     if (cateTxtEn === 'elevator_a') {
      //       store.commit('floor/setElevatorVisible')
      //     }
      //   }
      // }
    })
    let circle = new zrender.Circle({
      zlevel: 1,
      shape: {
        cx: x + 13,
        cy: y + 13,
        r: 15
      },
      style: {
        fill: 'rgb(123,104,238)',
        opacity: 1
      }
    })
    // 报警的颜色变红
    // if (obj.status === 2 || obj.already === 0 || obj.status === 3) {
    //   circle.attr('style', {
    //     fill: '#ff0000'
    //   })
    // }
    Group.add(objIcon)
    Group.add(circle)
  })
  return Group
}

// 插入点位
export const createPoints = (x, y, text) => {
  let point = new zrender.Image({
    style: {
      image: require('@/assets/images/location.png'),
      text: text,
      textPosition: [13, 12],
      textFill: 'white',
      x: x - 17,
      y: y - 42
    }
  })
  return point
}

// 插入时间信息
export const createTimeSpan = (x, y, text) => {
  let timeTip = new zrender.Rect({
    style: {
      text: text,
      fill: 'white',
      stroke: 'black'
    },
    shape: {
      x: x - 70,
      y: y - 70,
      width: 140,
      height: 25
    }
  })
  return timeTip
}

export const createLines = (x1, y1, x2, y2) => {
  let line = new zrender.Line({
    shape: {
      x1: x1,
      y1: y1,
      x2: x2,
      y2: y2
    },
    style: {
      stroke: 'rgb(0,225,51)',
      lineWidth: 3,
      lineDash: [4]
    }
  })
  return line
}

export const normalColor = new zrender.RadialGradient(0.5, 0.5, 0.5, [
  {
    offset: 0.5,
    color: '#16C93D'
  },
  {
    offset: 0.75,
    color: '#AAEBB4'
  },
  {
    offset: 1,
    color: '#CFF4D2'
  }
])

export const abnormalColor = new zrender.RadialGradient(0.5, 0.5, 0.5, [
  {
    offset: 0.5,
    color: '#FF6600'
  },
  {
    offset: 0.75,
    color: '#FFC79F'
  },
  {
    offset: 1,
    color: '#FFE0C7'
  }
])

export const clickColor = new zrender.RadialGradient(0.5, 0.5, 0.5, [
  {
    offset: 0.5,
    color: '#2a71ed'
  },
  {
    offset: 0.75,
    color: '#a3d0fd'
  },
  {
    offset: 1,
    color: '#e6f1fc'
  }
])
